<template>
  <j-modal
    :title="title"
    :width="600"
    :visible="visible"
    :maskClosable="false"
    :ok-button-props="{ props: { disabled: disableSubmit } }"
    @close="close"
    cancelText="关闭"
  >
    <div style="margin: 0 auto" :class="{ isCheck: isCheck }">
      <a-form-model ref="form" :label-col="labelCol" :wrapper-col="wrapperCol">
        <a-form-model-item label="单位名称">
          <a-input
            @click.native="openOrganModel"
            v-model="model.departName"
            :disabled="disableSubmit"
            readOnly
          ></a-input>
        </a-form-model-item>
        <a-form-model-item label="模板类型">
          <a-select v-model="model.tempType" placeholder="选择模板类型">
            <a-select-option v-for='(item,index) in tempList' :key='item.id' :value="item.id">
              {{item.name}}
            </a-select-option>
          </a-select>
        </a-form-model-item>

      </a-form-model>
      <OrganModal ref="departModal" @ok="updateQueryParam"></OrganModal>
    </div>
    <!-- table区域-end -->
  </j-modal>
</template>
<script>
  import {httpAction, getAction} from '@/api/manage'
  import OrganModal from '../../components/OrganModal'

  export default {
    name: 'SysPositionModal',
    components: {
      OrganModal
    },
    data() {
      return {
        labelCol: {span: 4},
        wrapperCol: {span: 18},
        disableSubmit: false,
        title: '机构信息',
        visible: false,
        isCheck: false,
        model: {},
        tempList: [],
        url: {
          list: '/sjxmzygl/sjWorkZtfa/getProTemplatList',
          add: "/xtsz/sjImplementTemplate/add",
          edit: "/xtsz/sjImplementTemplate/edit",
        },
      }
    },
    created() {
      this.getList()
    },
    watch: {},
    methods: {
      openOrganModel() {
        this.$refs.departModal.show()
        this.$refs.departModal.selectedKeys = [this.model.departId]
      },
      updateQueryParam(data) {
        this.model.departName = data.departName
        this.model.departId = data.id
        this.organShow = false
        this.$nextTick(() => {
          this.organShow = true
        })
      },
      add() {
        this.model = {
          departName:''
        }
        this.visible = true
      },
      edit(record) {
        this.model = Object.assign({}, record)
        this.visible = true
      },
      getList() {
        getAction(this.url.list).then((res) => {
          if (res.success) {
            this.tempList = res.result.records || res.result;
          }
        })
      },
      close(isSubmit) {
        if (isSubmit) {
          this.saveData()
        } else {
          this.visible = false
        }
      },
      saveData() {
        let url, type
        if (!this.model.id) {
          url = this.url.add
          type = 'post'
        } else {
          url = this.url.edit
          type = 'put'
        }
        httpAction(url, this.model, type).then((res) => {
          if (res.success) {
            this.$message.success(res.message)
            this.$emit('ok')
            this.visible = false
          } else {
            this.$message.error(res.message);
          }
        })
      }
    },
  }
</script>

<style lang="less" scoped>

  .name-type {
    width: 110px;
    margin-left: 5px;
    border: 1px solid #e0e0e0;

    /deep/ .ant-select-selection {
      box-sizing: border-box;
      min-height: 27px !important;

      .ant-select-selection__rendered {
        line-height: 27px !important;
      }
    }
  }
</style>
